<html>
  <head>
    <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
    <script>
      function miniEsc(){
        var input = $('#input').val().replace(/\r\n|\r|\n/g," ").replace( /\s\s+/g, ' ' ).replace(/"/g, '\\"' );
        $('#output').val(input);
        $('#info1').html($('#input').val().length);
        $('#info2').html(input.length);
      }
      
      function mini(){
        var input = $('#input').val().replace(/\r\n|\r|\n/g," ").replace( /\s\s+/g, ' ' );
        $('#output').val(input);
        $('#info1').html($('#input').val().length);
        $('#info2').html(input.length);
      }
      
      String.prototype.convertToHex = function (delim) {
          return this.split("").map(function(c) {
              return ("0" + c.charCodeAt(0).toString(16)).slice(-2);
          }).join(delim || "");
      };
      
      function byte(){
        var input = $('#input').val().convertToHex(",0x");
        $('#output').val("0x"+input);
        $('#info1').html($('#input').val().length);
        $('#info2').html((input.match(/,/g) || []).length+1);
      }
	  
	  function byteAndmini(){
		var input = "0x"+$('#input').val().replace(/\r\n|\r|\n/g," ").replace( /\s\s+/g, ' ' ).convertToHex(",0x");;
        $('#output').val(input);
        $('#info1').html($('#input').val().length);
        $('#info2').html((input.match(/,/g) || []).length+1);
	  }
    </script>
  </head>
  <body>
    <textarea id="input" rows="30" cols="80"></textarea><br />
    <p><span id="info1">0</span> => <span id="info2">0</span></p>
    <button onclick="mini()">minify</button>
    <button onclick="miniEsc()">minify + escape</button>
    <button onclick="byte()">byte-ify</button>
	<button onclick="byteAndmini()">minify + byte-ify</button><br />
    <textarea id="output" rows="30" cols="80"></textarea><br />
  </body>
</html>
